import React, { useState } from "react";
import { Card } from "antd";
import Picture from "./componet/picture";
import Artical from "./componet/artical";
const TabCard: React.FC = () => {
  const [activeTabKey1, setActiveTabKey1] = useState<string>("tab1");
  const tabList = [
    {
      key: "tab1",
      tab: "文章",
    },
    {
      key: "tab2",
      tab: "照片",
    },
  ];

  const onTab1Change = (key: string) => {
    setActiveTabKey1(key);
  };

  const contentList: Record<string, React.ReactNode> = {
    tab1:<Artical/>,
    tab2: <Picture/>,
  };

  return (
    <Card
      style={{ width: "100%" }}
      title="个人详情"
      tabList={tabList}
      activeTabKey={activeTabKey1}
      onTabChange={onTab1Change}
    >
      {contentList[activeTabKey1]}
    </Card>
  );
};
export default TabCard;
